import { Component, Emit, Prop, Watch } from 'vue-facing-decorator'
import Render from '@/render/Render'
import toNative from '@/utils/toNative'
import renderModal, {
    getModelValue,
    initModelValue,
    renderForm,
    type FormModalDto
} from '@/components/modal/Modal'
import type { FilterDto } from '@/render/FilterRender'
import { ProductTypeEnum } from '@/const/enum'

import { addContact, editContact } from '@/api/deal'
import type { SaleReqDto } from '@/api/deal/types'
import type { CompanyInfoDto, SaveTyxReqDto, GroupInfoDto } from '@/api/company/types'
import { saveTyInsureInfo } from '@/api/company'
import { getReceiptData, goBack } from '@/utils/util'
import { getDaliyInsuranceSolutionList } from '@/api/insurance/daily'
import { getOperatorInfo } from '@/api/operator'
import type { OperatorInfoDto } from '@/api/operator/types'
import { Button, message, Tag } from 'ant-design-vue'
import dayjs from 'dayjs'
import { CustomTitle } from '@/components/custom-title/Index'

@Component({
    expose: ['getData']
})
export class OpenG extends Render {
    @Prop() basicData!: GroupInfoDto
    @Prop() companyBasicInfo!: CompanyInfoDto

    operatorData = {} as OperatorInfoDto

    get periodCompanyTypeListValue() {
        const data = getModelValue(this.basicFormConfig)
        return data.periodCompanyTypeList
    }

    @Emit('refresh')
    handleRefresh() {}

    @Watch('basicData', {immediate: true})
    async handleWatch() {

        console.log(1111, this.basicData)
        // if (this.basicData.channelId) {
        //     this.basicFormConfig.items.receiptId.options = await getReceiptData(
        //         this.basicData.channelId
        //     )
        // }

        if (this.basicData.companyId) {
            this.operatorData = await this.getOperatorData()
        }
        // // 根据 保险公司获取投保方案列表
        // if (this.basicData.insureCompanyType) {
        //     this.basicFormConfig.items.insureTypeList.options = await this.insureTypeList(
        //         this.basicData.insureCompanyType
        //     )
        // }

        console.log(8888, this.operatorData, this.basicData, this.companyBasicInfo)
        if (this.basicData.isOpenTyrbStatus) {
            initModelValue(
                this.basicFormConfig,
                Object.assign(this.operatorData, this.basicData, this.companyBasicInfo)
            )
        }
    }

    basicFormConfig = this.initFormConfig() as FormModalDto
    initFormConfig() {
        return {
            title: '',
            width: '400px',
            theme: 'light',
            show: false,
            labelCol: {
                style: {
                    width: '7em'
                }
            },
            items: {
                saleId: {
                    name: '所属销售',
                    element: 'select',
                    optionsType: 'saleList',
                    required: true
                },
                insurCompany: {
                    name: '保险公司',
                    element: 'select',
                    optionsType: 'daliyInsuranceCompany',
                    params: {
                        clearable: false
                    },
                    required: true,
                    callback: {
                        change: async (value: string) => {
                            this.basicFormConfig.items.insureTypeList.value = []
                            this.basicFormConfig.items.insureTypeList.options = value
                                ? await this.insureTypeList(value)
                                : []
                        }
                    }
                },
                subMchid: {
                    name: '商户号',
                    element: 'input',
                    required: true
                },
                accountLimit: {
                    name: '公司对公账户',
                    element: 'input'
                },
                operatorName: {
                    name: '经办人姓名',
                    element: 'input'
                },
                operatorIdCard: {
                    name: '经办人身份证',
                    element: 'input'
                },
                contact: {
                    name: '经办人手机号',
                    element: 'input'
                }
            },
            complete: async () => {
                const data = getModelValue(this.basicFormConfig)
                console.log(1234, data)
                // await updatePayManagerUser(data)
                message.success('更新成功')
                this.basicFormConfig.show = false
            },
            cancel: () => {
                this.basicFormConfig.show = false
            },
            init: () => {}
        } as FormModalDto
    }
    basicForm = {
        validate: async () => {},
        clear: () => {},
        element: () => <> </>
    }

    filterBtnConfig() {
        return {} as FilterDto
    }

    async insureTypeList(insureCompany: string) {
        return (
            await getDaliyInsuranceSolutionList({
                insureCompany
            })
        ).map((item) => {
            item.label = item.dictLabel
            item.value = item.dictValue
            return item
        })
    }

    async getOperatorData() {
        const res = await getOperatorInfo({
            companyId: this.basicData.companyId
        })
        return res
    }

    async onSubmit() {
        await this.basicForm.validate()
        // await confirm('确认修改吗？', '提示', {
        //     type: 'warning'
        // })
        const params = getModelValue(this.basicFormConfig) as SaveTyxReqDto
        params.id = this.companyBasicInfo.companyId
        params.productType = ProductTypeEnum.GROUP
        params.receiptId = this.basicData.receiptId

        const saleParams = {
            companyId: this.basicData.companyId,
            id: this.basicData.dealId,
            productType: ProductTypeEnum.GROUP,
            saleId: params.saleId,
            serviceStartTime: dayjs().startOf('day').format('YYYY-MM-DD'),
            serviceState: 0
        } as SaleReqDto
        delete params.saleId
        await saveTyInsureInfo(params)
        if (!this.basicData.saleId) {
            await addContact(saleParams)
        } else {
            await editContact({
                ...saleParams,
                saleOldId: this.basicData.saleId
            })
        }
        message.success('更新成功')
        this.handleRefresh()
    }

    // async initData() {
    //     const res = await getOperatorInfo({ companyId: this.companyBasicInfo.companyId })

    //     console.log(1111, res)

    // }

    async created() {
        this.basicForm = renderForm(this.basicFormConfig)
        // await this.initData()
    }

    renderStatistics() {
        return <></>
    }

    renderRightBtns() {
        return <></>
    }

    render() {
        return (
            <div>
                <CustomTitle>
                    <div class="flex">
                        <span>开通长期保</span>
                        {/* <Tag
                            color={this.basicData.isOpenTyrbStatus ? 'processing' : 'error'}
                            class="ml-10px"
                        >
                            {InsuranceGroupOpenStatusCnEnum[this.basicData.isOpenTyrbStatus]}
                        </Tag> */}
                    </div>
                </CustomTitle>
                <div class="pt-20px">{this.basicForm.element()}</div>
                <div class="pt-19px flex justify-center gap-20px">
                    <Button onClick={goBack}>取消</Button>
                    <Button type="primary" onClick={this.onSubmit}>确认</Button>
                </div>
            </div>
        )
    }
}

export default toNative<
    { basicData: GroupInfoDto; companyBasicInfo: CompanyInfoDto },
    { refresh: () => void }
        >(OpenG)
